import axios from 'axios'
import Vue from 'vue'
import router from './router/index'
//错误的写法：export default http=axios.create()
const http1 = axios.create({
    //接口请求基位置/admin/api
    // baseURL: 'http://127.0.0.1:3000/admin/api',
    baseURL: process.env.VUE_APP_API_URL || '/admin/api',
})
//响应拦截器
http1.interceptors.response.use(res => {
    //正常响应(小于400状态码)进入res这个响应
    return res
}, err => {
    //错误响应(大于等于400状态码)进入err这个响应 
    //err.response表示返回的响应体  |err.response.data 表示响应数据
    //俗成约定data的message存放错误信息数据，就能把错误信息给提取到了 
    //如何在页面上面显示错误信息呢？用elementui的错误提示(已经挂载在vue的原型接口上面了)-通用的处理方法
    if (err.response.data.message) {
        Vue.prototype.$message({
            type: 'error',
            message: err.response.data.message
        })
    }
    //444错误跳转到登录页面
    if (err.response.status == 444) {
        console.log('login')
        //不是在.vue组件里面使用不了$router操作，所以要把路由给import进来
        router.push('/')
    }
    return Promise.reject(err)
})


// 请求拦截器，给请求头装token
http1.interceptors.request.use(config => {
    //设置请求头为token 俗成在token前面加 ’Barer[空格]‘
    if (sessionStorage.token !== undefined)
        config.headers.Authorization = 'Barer ' + sessionStorage.token
    //设置之后你就能在请求头里面找到Authorization的数值了，实现了token前端传后端
    return config
}, err => {
    return Promise.reject(err)
})
export default http1